<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>乐淘首页(键盘敲难,月薪过o.o1亿)</title>
    <!-- 引入font文件 -->
    <link rel="stylesheet" href="./assets/fontAwesome/css/font-awesome.css">
    <!-- 引入mui样式 -->
    <link rel="stylesheet" href="./assets/mui/css/mui.css">
    <!-- 公共样式 -->
    <link rel="stylesheet" href="./css/common.css">
    <!-- 首页样式 -->
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <!-- 头部 -->
    <header id="lt_header" class="mui-bar mui-bar-nav">
        <h1 class="mui-title">导航栏</h1>
        <!-- <a class="fa fa-search mui-pull-right"></a> -->
        <a href="./search.html" class="fa fa-search h-right"></a>
    </header>

    <!-- 内容 -->
    <div class="lt_view">
        <!-- mui 区块滑动 -->
        <div class="mui-scroll-wrapper">
            <div class="mui-scroll">
                <!-- 轮播图 -->
               <div class="mui-slider">
                   <!-- 自动轮播图 -->
                    <div class="mui-slider-group mui-slider-loop">
                        <!--支持循环，需要重复图片节点-->
                    <div class="mui-slider-item mui-slider-item-duplicate"><a href="#"><img src="./images/banner9.png" /></a></div>
                        <div class="mui-slider-item"><a href="#"><img src="./images/banner1.png" /></a></div>
                        <div class="mui-slider-item"><a href="#"><img src="./images/banner2.png" /></a></div>
                        <div class="mui-slider-item"><a href="#"><img src="./images/banner3.png" /></a></div>
                        <div class="mui-slider-item"><a href="#"><img src="./images/banner4.png" /></a></div>
                        <div class="mui-slider-item"><a href="#"><img src="./images/banner5.png" /></a></div>
                        <div class="mui-slider-item"><a href="#"><img src="./images/banner6.png" /></a></div>
                        <div class="mui-slider-item"><a href="#"><img src="./images/banner7.png" /></a></div>
                        <div class="mui-slider-item"><a href="#"><img src="./images/banner8.png" /></a></div>
                        <div class="mui-slider-item"><a href="#"><img src="./images/banner9.png" /></a></div>
                    
                        <!--支持循环，需要重复图片节点-->
                    <div class="mui-slider-item mui-slider-item-duplicate"><a href="#"><img src="./images/banner1.png" /></a></div>
                    </div>
                    <!-- 轮播图白点 -->
                    <div class="mui-slider-indicator">
                        <div class="mui-indicator mui-active"></div>
                        <div class="mui-indicator"></div>
                        <div class="mui-indicator"></div>
                        <div class="mui-indicator"></div>
                        <div class="mui-indicator"></div>
                        <div class="mui-indicator"></div>
                        <div class="mui-indicator"></div>
                        <div class="mui-indicator"></div>
                        <div class="mui-indicator"></div>
                    </div>
                </div>
                <!-- 导航 -->
                <div class="lt_nav">
                    <a href="javascript"><img src="./images/nav1.png" alt=""></a>
                    <a href="javascript"><img src="./images/nav2.png" alt=""></a>
                    <a href="javascript"><img src="./images/nav3.png" alt=""></a>
                    <a href="javascript"><img src="./images/nav4.png" alt=""></a>
                    <a href="javascript"><img src="./images/nav5.png" alt=""></a>
                    <a href="javascript"><img src="./images/nav6.png" alt=""></a>
                </div>
                <!-- 活动 -->
                <div class="lt_active mui-clearfix">
                    <a href="javascript:;"><img src="./images/active1.png" alt=""></a>
                    <a href="javascript:;"><img src="./images/active3.png" alt=""></a>
                    <a href="javascript:;"><img src="./images/active2.png" alt=""></a>
                </div>
                <!-- 品牌专区 -->
                <div class="brand-list">
                    <!-- 品牌介绍 -->
                    <div class="brand-item">
                        <div class="brand-title"><img src="./images/title0.png" alt=""></div>
                        <div class="brand-content">
                            <a href="javascript:;"><img src="./images/brand1.png" alt=""></a>
                            <a href="javascript:;"><img src="./images/brand2.png" alt=""></a>
                            <a href="javascript:;"><img src="./images/brand3.png" alt=""></a>
                            <a href="javascript:;"><img src="./images/brand4.png" alt=""></a>
                            <a href="javascript:;"><img src="./images/brand5.png" alt=""></a>
                            <a href="javascript:;"><img src="./images/brand6.png" alt=""></a>
                            <a href="javascript:;"><img src="./images/brand7.png" alt=""></a>
                            <a href="javascript:;"><img src="./images/brand8.png" alt=""></a>
                        </div>
                    </div>
                    <!-- 运动专区 -->
                    <div class="brand-sport">
                        <div class="brand-title1">
                            <a href="javascript:;"><img src="./images/title1.png" alt=""></a>
                        </div>
                        <div class="brand-content1">
                            <ul>
                                <li>
                                    <img src="./images/product.jpg" alt="">
                                    <div class="good-name">adidas阿迪达斯 男式 场下休闲篮球鞋S83700 adidas阿迪达斯 男式 场下休闲篮球鞋S83700 adidas阿迪达斯 男式 场下休闲篮球鞋S83700</div>
                                    <div class="good-price">
                                        <span>¥666.00</span>
                                        <del>¥888.00</del>
                                    </div>
                                    <button type="button" class="mui-btn mui-btn-primary">立即购买</button>
                                </li>
                                <li>
                                    <img src="./images/product.jpg" alt="">
                                    <div class="good-name">adidas阿迪达斯 男式 场下休闲篮球鞋S83700 adidas阿迪达斯 男式 场下休闲篮球鞋S83700 adidas阿迪达斯 男式 场下休闲篮球鞋S83700</div>
                                    <div class="good-price">
                                        <span>¥666.00</span>
                                        <del>¥888.00</del>
                                    </div>
                                    <button type="button" class="mui-btn mui-btn-primary">立即购买</button>
                                </li>
                                <li>
                                    <img src="./images/product.jpg" alt="">
                                    <div class="good-name">adidas阿迪达斯 男式 场下休闲篮球鞋S83700 adidas阿迪达斯 男式 场下休闲篮球鞋S83700 adidas阿迪达斯 男式 场下休闲篮球鞋S83700</div>
                                    <div class="good-price">
                                        <span>¥666.00</span>
                                        <del>¥888.00</del>
                                    </div>
                                    <button type="button" class="mui-btn mui-btn-primary">立即购买</button>
                                </li>
                            
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <!-- 尾部 -->
    <div class="lt_footer">
        <a href="javascript:;" class="active">
            <span class="fa fa-home"></span>
            <div class="link-name">首页</div>
        </a>
        <a href="./category.html">
            <span class="fa fa-bars"></span>
            <div class="link-name">分类</div>
        </a>
        <a href="javascript:;">
            <span class="fa fa-shopping-cart"></span>
            <div class="link-name">购物车</div>
        </a>
        <a href="javascript:;">
            <span class="fa fa-user"></span>
            <div class="link-name">会员中心</div>
        </a>
    </div>

</body>
<!-- mui.js 不依赖其他 -->
<script src="./assets/mui/js/mui.js"></script>
<!-- 方便我们自己开发 zepto -->
<script src="./assets/zepto/zepto.js"></script>
<!-- 公共的js -->
<script src="./js/common.js"></script>
<!-- 自己的js index.js -->
<script src="./js/index.js"></script>

</html>